<script lang="ts" setup>
	import gysOrderCard from "@/components/gys-order-card/gys-order-card.vue"
	import { ref, reactive, inject, toRefs } from "vue";
	import {
		onLoad,
		onShow,
		onReachBottom
	} from '@dcloudio/uni-app';
	import {
		getCurrentInstance
	} from 'vue'
	import {
		userStore
	} from '@/pinia';
	import {
		useRouter
	} from 'uni-mini-router';
	const {
		proxy,
	} = getCurrentInstance()
	const userStoreInfo = userStore();
	let router = useRouter()
	onLoad(() => {
		getList()
	})
	onReachBottom(() => {
		pageNum.value++
		getList()
	})
	onShow(() => {
		// dataList.value = []
		// pageNum.value = 1
		// getList()
	})
	//顶部的总tabs
	let topTabs = ref([{
		name: '订单',
	}, {
		name: '售后',
	}])
	let topTabsCurrent = ref(0)
	const topTabsClick = (e) => {
		//nav点击tabs
		topTabsCurrent.value = e.index
		switch (topTabsCurrent.value) {
			case 0:
				refundStatus.value = ''
				computedStatus()
				break;
			case 1:
				status.value = -1
				sendbackStatus.value = ''
				computedShou()
				break;
		}
	}
	//订单的tabs
	let tabs1 = ref([{
		name: '待付款',
	}, {
		name: '待发货',
	}, {
		name: '已发货',
	}, {
		name: '寄回',
	}, {
		name: '全部',
	}])
	let tabsCurrent1 = ref(0)
	const tabsClick1 = (e) => {
		//订单的tabs点击
		tabsCurrent1.value = e.index
		computedStatus()
	}
	const computedStatus = () => {
		//计算订单的类型
		sendbackStatus.value = ''
		dataList.value = []
		pageNum.value = 1
		switch (tabsCurrent1.value) {
			case 0:
				status.value = 1
				getList()
				break;
			case 1:
				status.value = 2
				getList()
				break;
			case 2:
				status.value = 3
				getList()
				break;
			case 3:
				status.value = 4
				computedJi()
				break;
			case 4:
				status.value = ''
				getList()
				break;
		}
	}
	let tabJi = ref([{
		name: '全部',
	}, {
		name: '待商家处理',
	}, {
		name: '待买家处理',
	}])
	let tabJiCurrent = ref(0)
	const tabsJiClick = (e) => {
		//寄回的tabs点击
		tabJiCurrent.value = e.index
		computedJi()
	}
	const computedJi = () => {
		//寄回的tabs计算
		dataList.value = []
		pageNum.value = 1
		switch (tabJiCurrent.value) {
			case 0:
				sendbackStatus.value = ''
				break;
			case 1:
				sendbackStatus.value = 1
				break;
			case 2:
				sendbackStatus.value = 2
				break;
		}
		getList()
	}
	//售后的tabs
	let tabs2 = ref([{
		name: '待商家处理',
	}, {
		name: '待买家处理',
	}, {
		name: '全部',
	}])
	let tabsCurrent2 = ref(0)
	const tabsClick2 = (e) => {
		//售后的tabs点击
		tabsCurrent2.value = e.index
		computedShou()
	}
	const computedShou = () => {
		dataList.value = []
		pageNum.value = 1
		switch (tabsCurrent2.value) {
			case 0:
				refundStatus.value = 1
				break;
			case 1:
				refundStatus.value = 2
				break;
			case 2:
				refundStatus.value = ''
				break;
		}
		getList()
	}
	const closeOrder = (e) => {
		//关闭订单
		console.log(e);
		closePop.value = true
		closePopList.value[0].id = e.id
	}
	const confirmClose = () => {
		//确认关闭订单
		proxy.$req('POST', proxy.$api.gysOrderEdit, {
			id: closePopList.value[0].id,
			status: -2,
		}).then((res) => {
			uni.$u.toast(res.message)
			if (res.success) {
				closePop.value = false
				pageNum.value = 1
				dataList.value = []
				getList()
			}
		})
	}
	const goSendHuo = (e) => {
		uni.$on('refreshSend', () => {
			pageNum.value = 1
			dataList.value = []
			getList()
			uni.$off('refreshSend')
		})
		//去发货	
		router.push({
			name: "sendGoods",
			params: {
				id: e.id
			}
		})
	}
	const viewLogistics = (e) => {
		//查看物流
		modalShow.value = true;
		wuliuItem = e.item
	}
	const confirmSignFor = (e) => {
		console.log(e);
		//确认收获
		proxy.$req('POST', proxy.$api.gysOrderEdit, {
			id: e.id,
			status: 4,
		}).then((res) => {
			uni.$u.toast(res.message)
			if (res.success) {
				pageNum.value = 1
				dataList.value = []
				getList()
			}
		})
	}
	const jihui = (e) => {
		//处理寄回
		router.push({
			name: 'jihuanOrderDetail',
			params: {
				id: e.id
			}
		})
	}
	const tuihuo = (e) => {
		//处理退货
		router.push({
			name: 'tuikuanOrderDetail',
			params: {
				id: e.id
			}
		})
	}
	let pageNum = ref(1)
	let dataList = ref([])
	let status = ref(1)
	let refundStatus = ref()
	let sendbackStatus = ref()
	const getList = () => {
		proxy.$req('GET', proxy.$api.gysOrderQuery, {
			pageNo: pageNum.value,
			pageSize: 10,
			/*订单状态（-1 申请售后；-2 订单关闭； 0：创建订单； 1：待支付；
			2：待发货；3：待收货；
			4：已收货待评价；5已评价 ；6寄回 ）*/
			status: status.value,
			/*售后状态 0 未申请 1 申请中   2已同意或同意待寄回 3已寄回 4已退款  5退款失败 -1取消售后*/
			refundStatus: refundStatus.value,
			/*
			寄回状态 0 未申请 1 申请中   2已同意或同意待寄回 3已寄回  -1取消寄回
			*/
			sendbackStatus: sendbackStatus.value
		}).then((res) => {
			dataList.value = dataList.value.concat(res.result.records)
		})
	}
	//关闭弹窗
	let closePop = ref(false)
	let closePopList = ref([
		{
			name: '未及时付款',
			checked: true,
			id: ''
		},
		{
			name: '买家不想买',
			checked: false,
			id: ''
		},
		{
			name: '买家信息填写错误，重新拍',
			checked: false,
			id: ''
		},
		{
			name: '买家恶意捣乱',
			checked: false,
			id: ''
		},
		{
			name: '缺货',
			checked: false,
			id: ''
		}
	])
	let modalShow = ref(false)
	let wuliuItem = ref(null)
	const copy = (e) => {
		uni.setClipboardData({
			data: e,
			success: function () {
				console.log('success');
			}
		});
	}
</script>
<template>
	<view class="navbar">
		<u-navbar :placeholder="true" leftText="" title="" auto-back>
			<template #center>
				<view style="width: 80%;display: flex;justify-content: center;">
					<u-tabs :list="topTabs" lineColor="#F56C6C" @click="topTabsClick"></u-tabs>
				</view>
			</template>
			<template #right>
				<!-- <view class="">
					<u-icon name="search" size="30"></u-icon>
				</view> -->
			</template>
		</u-navbar>
	</view>
	<view class="allTabs1" v-if="!topTabsCurrent">
		<!-- 订单 -->
		<view class="tabsSon1 r-flex-center-center">
			<u-tabs :list="tabs1" lineColor="#F56C6C" :current="tabsCurrent1" @click="tabsClick1"></u-tabs>
		</view>
		<view class="tabsSon1 r-flex-center-center" v-if="tabsCurrent1==3">
			<!-- 脑瘫设计的寄回tabs -->
			<u-tabs :list="tabJi" :current="tabJiCurrent" lineColor="#F56C6C" @click="tabsJiClick"></u-tabs>
		</view>
		<!-- <gys-order-card :list="dataList" @closeOrder="closeOrder" @goSendHuo="goSendHuo" @viewLogistics="viewLogistics"
			@confirmSignFor="confirmSignFor" @jihui="jihui" @tuihuo="tuihuo"></gys-order-card> -->
	</view>
	<view class="allTabs2" v-if="topTabsCurrent">
		<!-- 售后 -->
		<view class="tabsSon1 r-flex-center-center">
			<u-tabs :list="tabs2" lineColor="#F56C6C" :current="tabsCurrent2" @click="tabsClick2"></u-tabs>
		</view>

	</view>
	<gys-order-card :list="dataList" @closeOrder="closeOrder" @goSendHuo="goSendHuo" @viewLogistics="viewLogistics"
		@confirmSignFor="confirmSignFor" @jihui="jihui" @tuihuo="tuihuo"></gys-order-card>
	<u-popup :show="closePop" round="16" @close="closePop=false">
		<view class="closePop">
			<view class="cpTit">
				选择关闭理由
			</view>
			<view class="cpItem r-flex-between-center" v-for="(item,index) in closePopList" :key="index"
				@click="closePopList.map(it=>it.checked=false);item.checked=true">
				<text>{{ item.name }}</text>
				<view class="" v-if="item.checked">
					<u-icon name="checkbox-mark" size="18" color="#CB645E"></u-icon>
				</view>
			</view>
			<view class="cpBtn" @click="confirmClose">
				确认
			</view>
		</view>
	</u-popup>
	<u-modal :show="modalShow" title="物流单号" width="540rpx">
		<view style="font-size: 28rpx;font-weight: 400;color: rgba(0,0,0,0.45);text-align: center;">
			快递公司：{{ wuliuItem.deliveryName ||''}}；物流单号：{{ wuliuItem.deliveryId ||''}}，可复制号联系客服查询
		</view>
		<template #confirmButton>
			<view class="r-flex-between-center">
				<view style="width: 206rpx;height: 88rpx;line-height: 88rpx;background: rgba(255,255,255,0);border: 2rpx solid #CB645E;text-align: center;
					border-radius: 8rpx;font-size: 32rpx;font-weight: 500;color: #CB645E;" @click.stop="modalShow=false">
					关闭
				</view>
				<view
					style="width: 206rpx;height: 88rpx;line-height: 88rpx;background: #CB645E;border-radius: 8rpx;text-align: center;color: #fff;"
					@click="copy(wuliuItem.deliveryId)">
					复制单号
				</view>
			</view>
		</template>
	</u-modal>
</template>
<style lang="scss">
	page {
		background-color: #fafafa;
	}

	view {
		box-sizing: border-box;
	}

	.allTabs1 {
		.tabsSon1 {}
	}

	.allTabs2 {}

	.closePop {
		padding: 32rpx;

		.cpTit {
			font-weight: 700;
			text-align: center;
			margin-bottom: 30rpx;
		}

		.cpItem {
			padding: 32rpx 0;
			border-bottom: 1rpx solid #e7e7e7;
			font-size: 30rpx;
			font-weight: 600;
		}

		.cpBtn {
			width: 100%;
			height: 90rpx;
			line-height: 90rpx;
			background-color: #CB645E;
			border-radius: 8rpx;
			color: #fff;
			margin-top: 300rpx;
			text-align: center;
		}
	}
</style>